<template>
	<!-- 我的投递 -->
	<div class="p-delivery">
		<!-- 我的投递-用户信息 -->
		<v-info :resource="resource"></v-info>
		<div class="p-delivery-content">
			<div class="company-release-head flexBetween">
				<div class="company-release-search flexItems">
					<el-input v-model="input" placeholder="输入招聘职位或者公司名称"></el-input>
					<button class="zmlBtn1" @click="bindSearch">搜索</button>
				</div>
			</div>
			<div class="company-release-table">
				<table>
					<tr>
						<td>职位名称</td>
						<td>企业信息</td>
						<td>薪资</td>
						<td>投递日期</td>
						<td>企业反馈</td>
					</tr>
					<template v-if="ypList.length>0">
					<tr v-for="(item ,index) in ypList" :key="index">
						<td>
							<div v-if="item.positionVacant">
								<p class="color1 font16">{{item.positionVacant.positionName}}</p>
								<p class="h66">学历：{{item.positionVacant.educationTxt}}</p>
							</div>
						</td>
						<td>
							<div v-if="item.enterpriseResources && item.positionVacant">
								<p>
									<router-link to="">{{item.positionVacant.enterpriseName}}</router-link>
									<span v-for="(items, idx) in item.enterpriseResources.productTagTxt" :key="idx">{{items}}</span>
								</p>
								<p>{{item.positionVacant.corporateTypeTxt}}  |  {{item.enterpriseResources.staffNumberTxt}}人以上  |  注册资金：{{item.enterpriseResources.registeredCapital}}万人民币     </p>
								<p>{{item.positionVacant.vacantTypeTxt}}  |  工作地址：{{item.positionVacant.workplace}}</p>
							</div>
						</td>
						<td class="color2">{{item.positionVacant.salaryRangeTxt}}/月</td>
						<td class="h88">{{item.createTime}}投递</td>
						<td>{{item.feedBackStatusTxt}}</td>
					</tr>
					</template>
				</table>
			</div>
			<div class="company-release-page" v-if="total>pageSize">
				<el-pagination background
					@current-change="handleCurrentChange"
					:current-page="currentPage"
					:page-size="pageSize"
					layout="prev, pager, next, total, jumper"
					:total="total">
				</el-pagination>
			</div>
			<div class="tipBox" v-if="total==0">暂无数据~</div>
		</div>
	</div>
</template>
<script>
import { showToast, ajaxAdd, } from '@/utils/js.js';
import { myApply,resumeDetail } from '@/services/api.js';
import info from '@/components/userInfo.vue'
export default {
	components:{
		'v-info':info
	},
	data(){
		return{
			input:'',			//搜索框
			currentPage: 1, 	//当前页
			pageSize: 10,  		//一页几条
			total: 0,			//总条数
			ypList:[],  		//招聘数据列表
			resource:{}, //用户信息
		}
	},
	mounted() {
		this.content();
	},
	watch: {
		'$i18n.locale'() {
			this.content();
		}
	},
	methods:{
		// 搜索
		bindSearch(){
			this.$message({type: 'success',message: '这是搜索! ',duration: 1000});
		},
		// 页数改变时触发
		handleCurrentChange(val){
			console.log(`当前页: ${val}`);
			this.getList()
		},
		content() {
			//简历详情
			ajaxAdd(this, resumeDetail, {}, res => {
				
				//基本信息
				if (res.data.resource && Object.getOwnPropertyNames(res.data.resource).length > 0) {
					this.resource = res.data.resource;
					console.log('简历详情11111',res.data.resource)
				}
				this.eduInfos = res.data.eduInfos
				this.projectExps = res.data.projectExps
				this.qualificationList = res.data.qualificationList
				this.workExperiences = res.data.workExperiences
			});
			//我的投递裂变
			this.getList()
		},
		getList(){
			ajaxAdd(this, myApply, {}, res => {
				console.log('我的投递',res)
				let data =res.data.records
				
				if(data && data.length>0){
					this.currentPage = res.currentPage
					this.total = res.total
					console.log('enterpriseResources',data[0].enterpriseResources)
					console.log('positionVacant',data[0].positionVacant)
					for(let i = 0;i<data.length;i++){
						if(data[i].enterpriseResources){
							let str=data[i].enterpriseResources.productTagTxt
							if(data[i].enterpriseResources.productTagTxt){
								data[i].enterpriseResources.productTagTxt = str.split(',')
							}
							if(data[i].createTime){
								data[i].createTime = data[i].createTime.substr(0,10)
							}
						}
					}
				}
				this.ypList = data
			},err=>{
				showToast(this,err.msg)
			});
		},
	}
}
</script>
<style lang="scss">
.p-delivery-content{
	width: 100%;
	margin-top: 12px;
	background-color: #fff;
	padding: 30px 20px;
	min-height: 800px;
	.company-release-search{
		width: 520px;
		height: 36px;
		margin-bottom: 30px;
		
		.el-input{
			flex: 1;
			height: 100%;
			input{height: 100%;border-radius: 0;}
		}
		button{
			outline: none;
			border: 0;
			height: 100%;
			width: 120px;
			cursor: pointer;
			letter-spacing: 3px;
		}
	}
	.company-release-page{
		margin-top: 30px;
		display: flex;
		justify-content: center;
	}
	.el-pagination.is-background .el-pager li:not(.disabled).active{
		background-color: #0F54BC;
	}
	.company-release-table{
			margin-top: 12px;
			table{
				width: 100%;
				color: #666;
				tr{
					border: 1px solid #EDEDED;
					height: auto;
					td{
						padding: 20px 0;
					}
					td:nth-of-type(1){
						text-align: left;
						padding-left: 16px;
						p:nth-of-type(2){
							margin-top: 12px;
						}
					}
					td:nth-of-type(3),
					td:nth-of-type(4),
					td:nth-of-type(5){
						text-align: center;
					}
				}
				tr:nth-of-type(1){
					background-color: #F2F6FE;
					height: 50px;
				}
				
				.companyInfo{
					width: 450px;
					p{
						margin-top: 8px;
						font-size: 13px;
					}
					p:nth-of-type(1){
						a{
							font-size: 16px;
							color: #333333;
						}
						a:hover{
							color: #0F54BC;
							text-decoration: underline;
						}
						span{
							display: inline-block;
							padding: 2px 4px;
							color: #0F54BC;
							background-color: rgba(15,84,188,0.05);
							font-size: 12px;
						}
					}
				}
				.h33{
					color: #333;
				}
			}
		}
}
</style>
